<template>
  <div class="contain">
    <div class="box1">

     <ul>
         <li v-for="(val,index) in dataList" :key="index">
            <a href="#">
                <img :src="val.imgSrc" alt="">
                <p id="p1">{{val.p}}</p>
            </a>
         </li>
     </ul>

      <!-- <van-grid>
  <van-grid-item icon="https://gw.alicdn.com/tfs/TB19uWKXkCy2eVjSZPfXXbdgpXa-183-144.png?getAvatar=1" text="文字"/>
  <van-grid-item icon="https://gw.alicdn.com/tfs/TB1LvIxVAvoK1RjSZFDXXXY3pXa-183-144.png?getAvatar=1" text="文字" />
  <van-grid-item icon="https://gw.alicdn.com/tfs/TB1llI3f4n1gK0jSZKPXXXvUXXa-183-144.png?getAvatar=1" text="文字" />
  <van-grid-item icon="https://gw.alicdn.com/tfs/TB1O_AyVwHqK1RjSZFPXXcwapXa-183-144.png?getAvatar=1" text="文字11" />
</van-grid> -->
    </div>
  </div>
</template>

<style scoped>
.contain {
  width: 23.4375rem;
  float: left;
}
.contain .box1 {
  width: 21rem;
  margin: 0 auto 30px auto;
}
.box1 ul{
    width: 100%;
    height: 4rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.box1 li{
    width: 23%;
    position: relative;
}
.box1 li a{
   position: absolute;
   left:50%;
   transform: translateX(-50%);
}
.box1 img{
    width: 3rem;
    height: 3rem;
}
.box1 #p1{
    width: 100%;
    font-size: 1px;
    text-align: center;
}
</style>

<script>
export default {
  data () {
    return {
      dataList: [
        {
          path: '',
          p: '0元拼团',
          imgSrc: 'https://gw.alicdn.com/tfs/TB19uWKXkCy2eVjSZPfXXbdgpXa-183-144.png?getAvatar=1'
        },
        {
          path: '',
          p: '免费领卷',
          imgSrc: 'https://gw.alicdn.com/tfs/TB1LvIxVAvoK1RjSZFDXXXY3pXa-183-144.png?getAvatar=1'
        },
        {
          path: '',
          p: '智能设备',
          imgSrc: 'https://gw.alicdn.com/tfs/TB1llI3f4n1gK0jSZKPXXXvUXXa-183-144.png?getAvatar=1'
        },
        {
          path: '',
          p: '机票酒店',
          imgSrc: 'https://gw.alicdn.com/tfs/TB1O_AyVwHqK1RjSZFPXXcwapXa-183-144.png?getAvatar=1'
        }
      ]
    }
  }
}
</script>
